<template>
  <el-input
    type="number"
    v-model="model"
    :controls-position="position"
    :min="minVal"
    :max="maxVal"
    :placeholder="label"
    @change="handleChange($event)"
    @keydown.native="keydownCheck($event)"
    @paste.native.capture.prevent="handlePaste"/>
</template>
<script>

export default {
    name: "IntegerNumberInput",
    model: {
        prop: "model",
        event: "change"
    },
    props: {
        model: {
          type: String,
          default: ''
        },
        maxVal: {
          type: Number,
          default: 9999
        },
        minVal: {
          type: Number,
          default: 0
        },
        position: {
          type: String,
          default: "right"
        },
        label: {
            type: String,
            default: "请输入"
        }
    },
    data() {
        return {
          model: ""
        };
    },
    mounted() {

    },
    created() {

    },
    methods: {
      handleChange(e) {
         this.$emit('updateInput', this.model);
      },
      keydownCheck(e) {
        if (e.key == '.' || e.key == '-' || e.key == 'e') {
          e.returnValue = false;
          return false;
        }
        return true;
      },
      handlePaste(){
        // no action here
      }
    }
};
</script>

<style scoped>
</style>
